<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title>${title}</title>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
    <!--公用样式-->
    <link rel="stylesheet" type="text/css" href="${re.contextPath}/plugin/common/css/comment.css"/>
    <!--页面样式-->
    <link rel="stylesheet" type="text/css" href="${re.contextPath}/plugin/common/css/style.css"/>
    <!--Layui-->
    <link rel="stylesheet" href="${re.contextPath}/plugin/layui/css/layui.css" media="all"/>
    <!--扩展样式-->
    <link rel="stylesheet" href="${re.contextPath}/plugin/common/css/extended.css">
    <script type="text/javascript" charset="utf-8" src="${re.contextPath}/plugin/ueditor/ueditor.config.js"></script>
    <script type="text/javascript" charset="utf-8" src="${re.contextPath}/plugin/ueditor/ueditor.all.min.js"></script>
    <!--建议手动加在语言，避免在ie下有时因为加载语言失败导致编辑器加载失败-->
    <!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型，比如你在配置项目里配置的是英文，这里加载的中文，那最后就是中文-->
    <script type="text/javascript" charset="utf-8" src="${re.contextPath}/plugin/ueditor/lang/zh-cn/zh-cn.js"></script>
    <!--layui样式-->
    <link rel="stylesheet" href="${re.contextPath}/plugin/layui/css/layui.css" media="all"/>


    <style type="text/css">

        html {
            background: white;
        }

        div {
            width: 100%;
        }

        .editor-script {
            width: 100%;
            height: 600px;
            margin-left: 0px;
            margin-top: 0px;
        }

        .layui-layer-dialog {
            z-index: 99999999 !important;
        }
    </style>
</head>

<body class="whitebg">
<div class="x-body">
    <form class="layui-form layui-form-pane" style="margin-left: 20px;">
        <div style="margin-top: 30px;">
            <table>
                <tr>
                    <td>
                        <div style="text-align: center;margin-bottom: 20px;">
                            <input type="button" class="layui-btn layui-btn-normal layui-btn-sm" lay-submit
                                   lay-filter="save" style="width: 80px" value="保存" onclick="saveArt()">
                            <input type="button" class="layui-btn layui-btn-primary layui-btn-sm" style="width: 80px"
                                   id="close" value="取消">
                        </div>
                    </td>
                </tr>
                <tr>
                    <td width="20%">
                        <label class="layui-form-label">标题</label>
                        <div class="layui-input-inline" class="fl" style="width: 400px;">
                            <input type="text" autocomplete="off" id="title"
                                   value="${dto.title}"
                                   class="layui-input">
                            <input type="hidden" autocomplete="off" id="programId" value="${dto.programId}"
                                   class="layui-input">
                        </div>
                    </td>
                </tr>
                <tr style="margin-top: 5px;">
                    <td>
                        <label class="layui-form-label">关键字</label>
                        <div class="layui-input-inline" class="fl" style="width: 500px;">
                            <input type="text" name="keyword" id="keyword" type="text" class="layui-input"   value="${dto.keyword}"
                                   autocomplete="off">
                        </div>
                        <span style="color: red;">关键字多个，用、号隔开</span>
                    </td>
                </tr>

                <tr>
                    <td>
                        <label class="layui-form-label" style="width: 96%;">  图文信息</label>
                    </td>
                </tr>
                <tr>
                    <td>
                        <div class="editor-container">
                            <script class="editor-script" id="editor" type="text/plain"></script>
                        </div>
                    </td>
                </tr>
            </table>
        </div>
    </form>

</div>


<script type="text/javascript" src="${re.contextPath}/plugin/layui/layui.js"></script>
<!--JQ-->
<script type="text/javascript" charset="utf-8" src="${re.contextPath}/plugin/common/js/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="${re.contextPath}/plugin/tools/tool.js"></script>
<script>
    var layer, artType, artTypeId;
    layui.use('layer', function () {
        layer = layui.layer;
    })

    //实例化编辑器
    //建议使用工厂方法getEditor创建和引用编辑器实例，如果在某个闭包下引用该编辑器，直接调用UE.getEditor('editor')就能拿到相关的实例

    $(function () {
        var ue = UE.getEditor('editor', {
            initialFrameWidth: null,//宽度随浏览器自适应
            wordCount: false,//关闭字数统计
            autoHeightEnabled: false,//是否自动长高
        });
        UE.Editor.prototype._bkGetActionUrl = UE.Editor.prototype.getActionUrl;
        UE.Editor.prototype.getActionUrl = function (action) {
            // 这里很重要，很重要，很重要，要和配置中的imageActionName值一样
            if (action == 'uploadImage') {
                // 这里调用后端我们写的图片上传接口
                return '/ueditor/uploadImage';
            } else if (action == 'uploadFile') {
                return '/ueditor/uploadFile';
            } else {
                return this._bkGetActionUrl.call(this, action);
            }
        }
        ue.ready(function() {
            var info= '${dto.info}';
            UE.getEditor('editor').setContent(info, false);
        });

    });


    //保存方法
    function saveArt() {
        var title = $("#title").val();
        if (!title) {
            layer.msg("标题不能为空", {icon: 2});
            return false;
        }
        var keyword = $("#keyword").val();
        if (!keyword) {
            layer.msg("关键字不能为空", {icon: 2});
            return false;
        }
        //保存里程指南
        var content = UE.getEditor('editor').getContent();
        if (content.length == 0) {
            layer.msg("图文信息不能为空", {icon: 2});
            return false;
        }
        var programId = $("#programId").val();
        var json={
            programId:programId,
            title:title,
            keyword:keyword,
            info:content
        }
        layerAjax('/sys/base/programManager/update', json, '', function (d) {
            if (d.flag == true) {
                layer.msg(d.msg, {icon: 1});
            } else {
                layer.msg(d.msg, {icon: 2});
            }
            console.log(d);
        });
    }
    $('#close').click(function () {
        var index = parent.layer.getFrameIndex(window.name);
        parent.layer.close(index);
    });



    function isFocus(e) {
        alert(UE.getEditor('editor').isFocus());
        UE.dom.domUtils.preventDefault(e)
    }

    function setblur(e) {
        UE.getEditor('editor').blur();
        UE.dom.domUtils.preventDefault(e)
    }

    function insertHtml() {
        var value = prompt('插入html代码', '');
        UE.getEditor('editor').execCommand('insertHtml', value)
    }

    function createEditor() {
        enableBtn();
        UE.getEditor('editor');
    }

    function getAllHtml() {
        alert(UE.getEditor('editor').getAllHtml())
    }

    function getContent() {
        var arr = [];
        arr.push("使用editor.getContent()方法可以获得编辑器的内容");
        arr.push("内容为：");
        arr.push(UE.getEditor('editor').getContent());
        alert(arr.join("\n"));
    }

    function getPlainTxt() {
        var arr = [];
        arr.push("使用editor.getPlainTxt()方法可以获得编辑器的带格式的纯文本内容");
        arr.push("内容为：");
        arr.push(UE.getEditor('editor').getPlainTxt());
        alert(arr.join('\n'))
    }

    function setContent(isAppendTo) {
        var arr = [];
        arr.push("使用editor.setContent('欢迎使用ueditor')方法可以设置编辑器的内容");
        UE.getEditor('editor').setContent('欢迎使用ueditor', isAppendTo);
        alert(arr.join("\n"));
    }

    function setDisabled() {
        UE.getEditor('editor').setDisabled('fullscreen');
        disableBtn("enable");
    }

    function setEnabled() {
        UE.getEditor('editor').setEnabled();
        enableBtn();
    }

    function getText() {
        //当你点击按钮时编辑区域已经失去了焦点，如果直接用getText将不会得到内容，所以要在选回来，然后取得内容
        var range = UE.getEditor('editor').selection.getRange();
        range.select();
        var txt = UE.getEditor('editor').selection.getText();
        alert(txt)
    }

    function getContentTxt() {
        var arr = [];
        arr.push("使用editor.getContentTxt()方法可以获得编辑器的纯文本内容");
        arr.push("编辑器的纯文本内容为：");
        arr.push(UE.getEditor('editor').getContentTxt());
        alert(arr.join("\n"));
    }

    function hasContent() {
        var arr = [];
        arr.push("使用editor.hasContents()方法判断编辑器里是否有内容");
        arr.push("判断结果为：");
        arr.push(UE.getEditor('editor').hasContents());
        alert(arr.join("\n"));
    }

    function setFocus() {
        UE.getEditor('editor').focus();
    }

    function deleteEditor() {
        disableBtn();
        UE.getEditor('editor').destroy();
    }

    function disableBtn(str) {
        var div = document.getElementById('btns');
        var btns = UE.dom.domUtils.getElementsByTagName(div, "button");
        for (var i = 0, btn; btn = btns[i++];) {
            if (btn.id == str) {
                UE.dom.domUtils.removeAttributes(btn, ["disabled"]);
            } else {
                btn.setAttribute("disabled", "true");
            }
        }
    }

    function enableBtn() {
        var div = document.getElementById('btns');
        var btns = UE.dom.domUtils.getElementsByTagName(div, "button");
        for (var i = 0, btn; btn = btns[i++];) {
            UE.dom.domUtils.removeAttributes(btn, ["disabled"]);
        }
    }

    function getLocalData() {
        alert(UE.getEditor('editor').execCommand("getlocaldata"));
    }

    function clearLocalData() {
        UE.getEditor('editor').execCommand("clearlocaldata");
        alert("已清空草稿箱")
    }
</script>
</body>

</html>